import { Route, RouteProps } from 'react-router-dom'

// 使用方式：
/*
	<KeepAlive path="/home">
		<Layout />
	</KeepAlive>
*/
export const KeepAlive = ({
  children,
  Component,
  ...rest
}: RouteProps & { Component: any }) => {
  return (
    <Route
      {...rest}
      children={(props) => {
        // const isMatch = props.match !== null

        return (
          <div
            className="keep-alive"
            style={{
              height: '100%',
              // display: isMatch ? 'block' : 'none',
              display: props.match ? 'block' : 'none',
            }}>
            {/* {children} */}
            <Component />
          </div>
        )
      }}
    />
  )
}
